<!DOCTYPE HTML>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="generator" content="www.jsdaima.com"
	data-variable=",cn,10001,,10001,M1156015" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<title>全民健身</title>
<meta name="author" content="js代码" />
<meta name="copyright" content="js代码" />
<link rel='stylesheet' href='css/index.css'>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
</head>

<body class=" nav-header">

	<header class="">
		<div class="head-box">
			<div class="container">
				<div class="head-left">
					<div class="head-left-wrapper">
						<div class="head-left-slide">
							<p>欢迎光临全民健身！</p>

						</div>
					</div>
				</div>
				<div class="head-right">
					<div class="head-other">
						<b> 登录/注册 <i class="caret"> </i>
						</b> <span> <a href="login.html" title="登录"> <i
								class="fa fa-bookmark"> </i> 登录
						</a>
							<hr /> <a href="regist.html" title="注册"> <i
								class="fa fa-book"> </i> 注册
						</a>
						</span>
					</div>
				</div>
			</div>
		</div>
	</header>
	<nav class="navbar navbar-default met-nav " role="navigation">
		<div class="container">
			<div class="navbar-header">
				<button type="button"
					class="navbar-toggle hamburger hamburger-close collapsed"
					data-target="#navbar-default-collapse" data-toggle="collapse">
					<span class="sr-only"> Toggle navigation </span> <span
						class="hamburger-bar"> </span>
				</button>
				<a href="#" class="navbar-brand navbar-logo vertical-align" title="">
					<h1 class='hide'>全民健身</h1>
					<div class="vertical-align-middle">
						<img src="picture/logo.png" alt="" title="" />
					</div>
				</a>
				<h2 class='hide'></h2>
			</div>
			<div class="collapse navbar-collapse navbar-collapse-toolbar"
				id="navbar-default-collapse">

				<ul class="nav navbar-nav navbar-right navlist">
					<li class="margin-right-20"><a href="index.html" title="首页"
						class="link active"> 首页 </a></li>

					<li class="dropdown margin-right-20"><a class="link  "
						href="course.html"> 场馆信息 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="team.html"> 学员信息 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="relationship.html"> 关注 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="contact.html"> 通知 </a>
						<ul style="display: none">
						</ul></li>
					<li class="dropdown margin-right-20"><a class="link  "
						href="coach.html"> 个人中心 </a>
						<ul style="display: none">
						</ul></li>
				</ul>
			</div>
		</div>
	</nav>

	<div class="met-column-nav ">
		<div class="container">
			<div class="row">
				<div class="sidebar-tile">
					<ul class="met-column-nav-ul invisible-xs">
						<a href='index.html'> 主页 </a> >
						<a href='coach.html'> 个人中心 </a> >
						<a href='myorders.html'> 我的订单 </a> 
					</ul>
				</div>
			</div>
		</div>
	</div>
	<!--关注模块  -->
	.
	<div class="container">
		<div id="orderapp">
        <div>
            <table>
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>订单编号</th>
                        <th>学员名字</th>
                        <th>订单时间</th>
                        <th>评价</th>
                        <th>评价内容</th>
                        <th>订单状态</th>

                    </tr>
                </thead>
                <tbody>
                    <tr v-for="(order,index) in orders">
                        <td>{{index+1}}</td>
                        <td>{{order.orderNumber}}</td>
                        <td>{{order.user.uname}}</td>
                        <td>{{order.orderTime}}</td>
                        <td v-if="order.evaluation ==1">好评</td>
                        <td v-else-if="order.evaluation ==2">中评</td>
                        <td v-else-if="order.evaluation ==3">差评</td>
                        <td v-else></td>
                        <td>{{order.content}}</td>
                        <td v-if="order.ostatus ==1"><button @click="endclass(order.oid)">上课</button></td>
                        <td v-else-if="order.ostatus ==2">等待学生确认付款</td>
                        <td v-else-if="order.ostatus ==3">学生已付款                                                                                                                                                                                                                                                                                                                </button></td>
                        <td v-else-if="order.ostatus ==4">已结束</td>

                    </tr>
                </tbody>
               

                <tfoot>
                  <tr>
                      <td colspan="7">
                      	<button v-for="n in totalPage" @click="goPage(n)">{{n}}</button>
                      </td>
                  </tr>
                </tfoot>

            </table>


        </div>

    </div>
		
	</div>

	<div class="met-footnav">
		<div class="container">
			<div class="row mob-masonry">
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a href="#" title="关于我们"> 关于我们 </a>
					</h4>

				</div>
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a href="#" title="新闻资讯"> 新闻资讯 </a>
					</h4>

				</div>
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a> 会馆信息 </a>
					</h4>

				</div>
				<div class="col-md-2 col-sm-3 col-xs-6 list masonry-item">
					<h4>
						<a> 更多 </a>
					</h4>
				</div>
				<div class="col-md-4 col-ms-12 col-xs-12 info masonry-item">
					<div class="info-phone">
						<b> 服务热线 </b> <em> <a> 400-123-4567 </a>
						</em>
						<p>客服服务时段：周一至周五，9:30 - 20:30，节假日休息</p>

					</div>
				</div>
			</div>
		</div>
	</div>

	<footer>
		<div class="container text-center">
			<div class="powered_by_metinfo">Copyright &copy; 2002-2020 死亡健身
				版权所有</div>
		</div>
	</footer>
	<button type="button"
		class="btn btn-icon btn-primary btn-squared met-scroll-top hide">
		<i class="icon wb-chevron-up" aria-hidden="true"> </i>
	</button>
	<script src="js/index.js">
		</script>
	<style>
#app {
	border: 2px;
	border-radius: 10px;
	background-color: white;
	margin: 10px auto;
	width: 85%;
	height: 800px;
	text-align: center;
}
</style>
	<script type="text/javascript">
	  let app11 = new Vue({
          el: "#orderapp",
          data() {
              return{
            	  orders: [],
                  totalPage: 0
              }
          },
         mounted(){
        	  axios({
        		  url:"/order/coachordersbypage",
        		  methods:"get",
        		  params:{"page":1}, 
        	  }).then(res =>{
        		  if(res.data.code==500){
						location.href="/error/500.html";
					}
        		  else if(res.data.code == 200){
        			  this.orders =res.data.data.data;
        			  this.totalPage = res.data.data.totalPage;
        		  }
        	  })
          },
          methods:{
        	  goPage:function(n){
        		  axios({
            		  url:"../order/coachordersbypage",
            		  methods:"get",
            		  params:{"page":n}, 
            	  }).then(res=>{
            		  if(res.data.code==500){
  						location.href="/error/500.html";
  					}else if(res.data.code == 200){
            			  this.orders =res.data.data.data;
            			  this.totalPage = res.data.data.totalPage;
            		  }
            	  })
        	  },
           endclass:function(oid){
        	   axios({
         		  url:"../order/endclass",
         		  methods:"get",
         		  params:{"oid":oid}, 
         	  }).then(res =>{
                  if(res.data.code == 200){
                	  
                      for(let order of this.orders){
                    	  if(order.oid == oid){
                    		  order.ostatus =2//将订单状态设置为已结课
                    		  break;
                    	  }
                      }
                  }else if(res.data.code==500){
						location.href="/error/500.html";
					}
              })
           }
          }
      })
		</script>
</body>

</html>

